function showSpectrumInCanvas(eCanvas, eAudio) {
    const AudioContext = window.AudioContext || window.webkitAudioContext || window.mozAudioContext;
    let audioCtx = undefined, source = undefined, analyser = undefined;
    eAudio.addEventListener('play', () => {
        if (!audioCtx) {
            audioCtx = new AudioContext();
            source = audioCtx.createMediaElementSource(eAudio);
            analyser = audioCtx.createAnalyser();
            analyser.fftSize = 512;
            source.connect(analyser);
            analyser.connect(audioCtx.destination);
        }
        let bufferLength = analyser.frequencyBinCount;
        let dataArray = new Uint8Array(bufferLength);
        
        let ctx = eCanvas.getContext("2d");
        let WIDTH = eCanvas.width;
        let HEIGHT = eCanvas.height;
    
        let barWidth = WIDTH / bufferLength * 1.5;
        let barHeight;
    
        function renderFrame() {
            requestAnimationFrame(renderFrame);
    
            analyser.getByteFrequencyData(dataArray);
    
            ctx.clearRect(0, 0, WIDTH, HEIGHT);
    
            for (let i = 0, x = 0; i < bufferLength; i++) {
                barHeight = dataArray[i] / 2;
    
                let g = barHeight + 25 * (i / bufferLength);
                let b = 250 * (i / bufferLength);
                let r = 150;
    
                ctx.fillStyle = "rgb(" + r + "," + g + "," + b + ")";
                ctx.fillRect(x, HEIGHT - barHeight, barWidth, barHeight);
    
                x += barWidth + 2;
            }
        }
        renderFrame();
    });
}

let can = document.getElementById('can-audio');
let player = document.getElementById('player-audio');
showSpectrumInCanvas(can, player);
player.children[0].onload = () => {
    Toast.info('加载完成！');
}